<template>
  <div class="container">
    <Header></Header>
    <Nav></Nav>
    <div>
      <div class="content">
        <div class="top">{{ this.parent_title }}</div>
        <div class="bottom">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{ this.parent_troduction }}</div>
        <i class="el-icon-thumb thumb" @click="thumb()">{{ count }}</i>
      </div>
    </div>
    <Footer></Footer>
  </div>
</template>

<script>
import Header from '../components/header.vue'
import Nav from '../components/nav.vue'
import Footer from '../components/footer.vue'
import eventBus from '../views/eventBus'
export default {
  name: 'main_starNews',
  components: {
    Header,
    Nav,
    Footer
  },
  data() {
    return {
      main_sn1: "",
      parent_title: [],
      parent_troduction: [],
      count: 0
    }
  },
  created() {
    eventBus.$on('parent_title', item => {
      this.parent_title = item
      console.log(this.parent_title)
    }),
      eventBus.$on('parent_troduction', item => {
        this.parent_troduction = item
        console.log(this.parent_troduction)
      })
  },
  mounted() {
  },
  methods: {
    thumb() {
      this.count++
      alert('谢谢点赞哦')

    }
  }
}
</script>

<style scoped>
.content,
.top,
.bottom {
  width: 800px;
  height: auto;
}

.content {
  margin-left: 300px;
  height: 500px;
}

.top {
  font-size: 30px;
  text-align: center;
}

.bottom {
  font-size: 15px;
  line-height: 40px;
}

.thumb {
  float: right;
  font-size: 30px;
}
</style>
